<#macro head title="">
<head>
    <meta charset="UTF-8">
    <!-- 初始化移动浏览显示 -->
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <!-- 在IE运行最新的渲染模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta http-equiv="X-UA-Compatible" content="IE=9"/>

    <#if title=="">
        <title>${systemName}</title>
    <#else>
        <title>${title}</title>
    </#if>

    <!-- bootstrap -->
    <link rel="stylesheet" type="text/css"
          href="${request.contextPath}/assets/bootstrap/css/bootstrap.min.css?v=3553060703">
    <!-- font-awesome 字体 -->
    <link rel="stylesheet" type="text/css"
          href="${request.contextPath}/assets/fonts-awesome/css/font-awesome.min.css?v=3553060703">
    <!-- 滚动 -->
    <link rel="stylesheet" type="text/css"
          href="${request.contextPath}/assets/nanoscroller/nanoscroller.css?v=3653060703">
    <!-- 弹窗 -->
    <link rel="stylesheet" type="text/css"
          href="${request.contextPath}/assets/sweetalert2/sweetalert2.min.css?v=3653060703">
    <!-- 加载 -->
    <!-- 自定义 -->
    <link rel="stylesheet" type="text/css" href="${request.contextPath}/assets/alone/css/user-defined.css?v=3553060703">

<#--日期-->
    <link rel="stylesheet" type="text/css"
          href="${request.contextPath}/assets/bootstrap/datetimepicker/bootstrap-datetimepicker.min.css?v=3553060703">

<#--<!--[if lte IE 9]>-->
    <script src="${request.contextPath}/assets/bootstrap/js/respond.min.js?v=3553060703"></script>
    <script src="${request.contextPath}/assets/bootstrap/js/html5shiv.min.js?v=3553060703"></script>
<#--<![endif]&ndash;&gt;-->

    <#nested>
</head>
</#macro>

<#macro foot>
<!-- jquery -->
<script type="text/javascript" src="${request.contextPath}/assets/js/jquery-1.12.4.min.js?v=3653060703"></script>
<#--moment 时间要求在bootstrap.min.js之前-->
<!-- bootstrap -->
<script type="text/javascript" src="${request.contextPath}/assets/bootstrap/js/bootstrap.min.js?v=3553060703"></script>
<#--日期-->
<script type="text/javascript"
        src="${request.contextPath}/assets/bootstrap/datetimepicker/bootstrap-datetimepicker.min.js?v=3553060703"></script>
<!-- 滚动 -->
<script type="text/javascript"
        src="${request.contextPath}/assets/nanoscroller/jquery.nanoscroller.min.js?v=3653060703"></script>
<!-- 弹窗 -->
<script type="text/javascript"
        src="${request.contextPath}/assets/sweetalert2/sweetalert2.all.min.js?v=3653060703"></script>
<!-- 加载 -->
<!-- 提示框 -->
<script type="text/javascript"
        src="${request.contextPath}/assets/js/jquery.bootstrap-growl.min.js?v=3653060703"></script>
<!-- Loader居中 -->
<script type="text/javascript" src="${request.contextPath}/assets/js/center-loader.min.js?v=3653060703"></script>
<!-- 自定义 -->
<script type="text/javascript" src="${request.contextPath}/assets/alone/js/app.js?v=3553060703"></script>

<script type="text/javascript">
    //动态设置高
    function resize() {
        var visibleHeight = document.documentElement.clientHeight;
        var visibleWidth = document.documentElement.clientWidth;
        if ('${viewName}' == "indexTop") {
            $(".main-box").css("min-height", visibleHeight - 90);
        }
        else {
            $(".main-box").css("min-height", visibleHeight);
        }
        $(".leftDiv").css("min-height", visibleHeight - 90);
    }

    resize();
    window.onresize = resize;
    /*
     * 对选中的标签激活active状态，对先前处于active状态但之后未被选中的标签取消active
     * （实现左侧菜单中的标签点击后变色的效果）
     */
    $(document).ready(function () {


        $('.panel').click(function () {
            $('.panel').each(function () {
                $(this).removeClass("active");
            });
            $(this).toggleClass("active");
        });
//        $('.menu-second').click(function () {
//            $(".menu-second-selected").each(function () {
//                $(this).attr("class", "menu-second");
//                $(this).css("background-color", "#f6f6f6");
//            });
//            var href = $(this).parent().parent().attr("id");
//            $("[href='#" + href + "']").parent().addClass("active"); //选中
//            $("[href='#" + href + "']").removeClass("collapsed"); //改变箭头
//            $(this).parent().parent().attr("class", "nav nav-list collapse in");
//            $(this).attr("class", "menu-second-selected"); //选中二级
//            $(this).css("background-color", "#66c3ec");
//            $(this).css("text-decoration", "none");
//        });
        $(".nav-header").each(function () {
            var pathname = window.location.pathname;
            if (window.location.pathname == "") {
                pathname = "/";
            }
            if ($(this).attr("href") == pathname) {
                $(this).parent().addClass("active");
            }
        });
        $(".menu-second").each(function () {
            if ($(this).attr("href") == window.location.pathname) {
                var href = $(this).parent().parent().attr("id");
                $("[href='#" + href + "']").parent().addClass("active"); //选中
                $("[href='#" + href + "']").removeClass('collapsed'); //改变箭头
                $(this).parent().parent().attr("class", "nav nav-list collapse in");
                $(this).attr("class", "menu-second-selected"); //选中二级
            }
        });

        $(".top-menu-second").each(function () {
            if ($(this).attr("href") == window.location.pathname) {
                $(this).css("background", "#bbdefb");
                if ($(".nav-header").length == 1)
                    $(this).parent().parent().parent().toggleClass("active");
            }
        });

    });

    /*
     * 解决ajax返回的页面中含有javascript的办法：
     * 把xmlHttp.responseText中的脚本都抽取出来，不管AJAX加载的HTML包含多少个脚本块，我们对找出来的脚本块都调用eval方法执行它即可
     */
    function executeScript(html) {
        var reg = /<script[^>]*>([^\x00]+)$/i;
        //对整段HTML片段按<\/script>拆分
        var htmlBlock = html.split("<\/script>");
        for (var i in htmlBlock) {
            var blocks;//匹配正则表达式的内容数组，blocks[1]就是真正的一段脚本内容，因为前面reg定义我们用了括号进行了捕获分组
            if (blocks = htmlBlock[i].match(reg)) {
                //清除可能存在的注释标记，对于注释结尾-->可以忽略处理，eval一样能正常工作
                var code = blocks[1].replace(/<!--/, '');
                try {
                    eval(code) //执行脚本
                }
                catch (e) {
                }
            }
        }
    }

    /*
     * 利用div实现左边点击右边显示的效果（以id="content"的div进行内容展示）
     * 注意：
     *   ①：js获取网页的地址，是根据当前网页来相对获取的，不会识别根目录；
     *   ②：如果右边加载的内容显示页里面有css，必须放在主页（即例中的index.jsp）才起作用
     *   （如果单纯的两个页面之间include，子页面的css和js在子页面是可以执行的。 主页面也可以调用子页面的js。但这时要考虑页面中js和渲染的先后顺序 ）
     */
    function showAtRight(url) {
        if (url.indexOf(".jsp") > 0)
            location.href = url;
        else
            return;

        var xmlHttp;
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlHttp = new XMLHttpRequest();    //创建 XMLHttpRequest对象
        }
        else {
            // code for IE6, IE5
            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlHttp.onreadystatechange = function () {
            //onreadystatechange — 当readystate变化时调用后面的方法
            if (xmlHttp.readyState == 4) {
                //xmlHttp.readyState == 4    ——    finished downloading response
                if (xmlHttp.status == 200) {
                    //xmlHttp.status == 200        ——    服务器反馈正常
                    document.getElementById("content").innerHTML = xmlHttp.responseText;    //重设页面中id="content"的div里的内容
                    executeScript(xmlHttp.responseText);    //执行从服务器返回的页面内容里包含的JavaScript函数
                }
                //错误状态处理
                else if (xmlHttp.status == 404) {
                    alert("出错了☹   （错误代码：404 Not Found），……！");
                    /* 对404的处理 */
                    return;
                }
                else if (xmlHttp.status == 403) {
                    alert("出错了☹   （错误代码：403 Forbidden），……");
                    /* 对403的处理  */
                    return;
                }
                else {
                    alert("出错了☹   （错误代码：" + request.status + "），……");
                    /* 对出现了其他错误代码所示错误的处理   */
                    return;
                }
            }
        };
        //把请求发送到服务器上的指定文件（url指向的文件）进行处理
        xmlHttp.open("GET", url, true);        //true表示异步处理
        xmlHttp.send();
    }

    function updatePassword() {
        $('#modal_password').find(".modal-title").text('修改密码');
        clearForm($('#modal_password'));
        $.ajax({
            type: 'POST',
            url: '${request.contextPath}/usermanage/getSessionUser',
            success: function (data) {
                //成功之后
                if (data.success) {
                    $("#layout_cUserCode").val(data.data["cUserCode"]);
                    $("#layout_cUserName").val(data.data["cUserName"]);
                    var layout_cDeptName = data.data["cDeptName"];
                    if (data.data["cDeptName"] == null) {
                        layout_cDeptName = " ";
                    }
                    $("#layout_cDeptName").val(layout_cDeptName);
                }
                else {
                    swal("错误", data.errorMsg, "error");
                }
            },
            error: function (xhr, type) {
                swal("错误", "系统发生内部错误!请稍后再试!", "error");
            }
        });
        $("#btnPasswordSave").unbind();
        $("#btnPasswordSave").click(savePassword);
        $('#modal_password').modal();
    }

    //修改密码
    function savePassword() {
        var userCode = $("#layout_userCode").val();
        if ($("#layout_newPassword").val() == "") {
            swal("错误", "密码不能为空", "error");
            return;
        }
        if ($("#layout_newPassword").val() != $("#layout_confirmPassword").val()) {
            swal("错误", "两次密码输入不一致", "error");
            return;
        }
        swal({
            title: "确定修改密码？",
            text: "完成后需要重新登录",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "是的,确定",
            cancelButtonText: "取消"
        }).then(function (result) {
            if (result.value) {
                $.ajax({
                    type: 'POST',
                    data: 'cPassword=' + $("#layout_newPassword").val(),
                    url: '${request.contextPath}/usermanage/updatepassword',
                    success: function (data) {
                        //成功之后
                        if (data.success) {
                            location.href = "${request.contextPath}/logout";
                        }
                        else {
                            swal("错误", data.errorMsg, "error");
                        }
                    },
                    error: function (xhr, type) {
                        swal("错误", "系统发生内部错误!请稍后再试!", "error");
                    }
                });
            }
        });
    }

</script>

    <#nested>
</#macro>

<#macro top>
<nav class="navbar navbar-default navbar-fixed-top">
    <div class="container-fluid">
        <div class="navbar-header">
            <a id="logo" class="navbar-brand">
                <span>
                    <img src="${request.contextPath}/assets/img/logo-white.png" alt=""
                         height="28px"/>|&nbsp;&nbsp;${systemName}
                </span>
            </a>
        </div>

        <div class="collapse navbar-collapse">
            <ul class="nav navbar-nav navbar-left">
                <li class="">
                    <a href="${request.contextPath}/" class="nav-header"><i class="fa fa-home"></i>&nbsp; 首页</a>
                </li>
                <#list userMenus as topMenu>
                    <li class="dropdown">
                        <a href="#${topMenu.cModelName}" class="dropdown-toggle"
                           data-toggle="dropdown">${topMenu.cModelName}<span class="caret"></span></a>
                        <ul class="dropdown-menu dropdown-caret" role="menu">
                            <#list topMenu.children as childMenu>
                                <li><a href="${request.contextPath}${childMenu.cURL}"
                                       class="top-menu-second">${childMenu.cModelName}</a></li>
                            </#list>
                        </ul>
                    </li>
                </#list>
            <#--<li class="dropdown">-->
            <#--<a href="#" class="dropdown-toggle" data-toggle="dropdown">系统设置 <span class="caret"></span></a>-->
            <#--<ul class="dropdown-menu" role="menu">-->
            <#--<li><a href="${request.contextPath}/customEvent" class="top-menu-second">定制事件</a></li>-->
            <#--</ul>-->
            <#--</li>-->
            </ul>

            <ul class="nav navbar-nav navbar-right">
                <li><a onclick="updatePassword()"><i class="fa fa-user"></i></a></li>
                <li><a href="${request.contextPath}/logout" onclick="onAtRight('')"><i class="fa fa-power-off"></i></a>
                </li>
            </ul>
        </div>
    </div>
</nav>
<!-- 密码修改弹出框 -->
    <@modal.editModal id="modal_password" buttonId="btnPasswordSave" width="300px">
    <input name="userCode" id="layout_userCode" type="hidden"/>
        <@mform.container>
            <@mform.row>
                <@mform.input_text id="layout_cUserCode" name="cUserCode"
                label="用户编码" placeholder="" icon="fa-edit" disabled="true"/>
                <@mform.input_text id="layout_cUserName" name="cUserName"
                label="用户姓名" placeholder="" icon="fa-edit" disabled="true"/>
                <@mform.input_text id="layout_cDeptName" name="cDeptName"
                label="部门名称" placeholder="" icon="fa-edit" disabled="true"/>
                <@mform.input_password id="layout_newPassword" name="newPassword"
                label="新密码" placeholder="请输入新密码" icon="fa-edit" />
                <@mform.input_password id="layout_confirmPassword" name="confirmPassword"
                label="确认密码" placeholder="请再次输入密码" icon="fa-edit" />
            </@mform.row>
        </@mform.container>
    </@modal.editModal>
</#macro>

<#--<#macro left>-->
<#--<div class="container-fluid">-->
<#--<div class="row">-->
<#--<div class="col-sm-3 col-md-2 sidebar">-->
<#--<div class="leftDiv">-->
<#--<ul id="menuUl" class="nav nav-sidebar">-->
<#--<li class="panel">-->
<#--<a href="${request.contextPath}/" class="nav-header menu-first collapsed">-->
<#--<i class="fa fa-home"></i>&nbsp; 首页-->
<#--<span class="sr-only"></span>-->
<#--</a>-->
<#--</li>-->
<#--<#list userMenus as headerMenu>-->
<#--<li class="panel">-->
<#--<a href="#${headerMenu.cModelName}" class="nav-header menu-first collapsed" data-toggle="collapse" data-parent="#menuUl">-->
<#--<i class="fa fa-gear"></i>&nbsp; ${headerMenu.cModelName}-->
<#--<span class="pull-right glyphicon glyphicon-chevron-toggle"></span>-->
<#--</a>-->
<#--<ul id="${headerMenu.cModelName}" class="nav nav-list collapse">-->
<#--<#list headerMenu.children as childMenu>-->
<#--<@mainMenu parentMenu=childMenu/>-->
<#--</#list>-->
<#--</ul>-->
<#--</li>-->
<#--</#list>-->
<#--&lt;#&ndash;<li class="panel">&ndash;&gt;-->
<#--&lt;#&ndash;<a href="#userMeun" class="nav-header menu-first collapsed" data-toggle="collapse" data-parent="#menuUl">&ndash;&gt;-->
<#--&lt;#&ndash;<i class="fa fa-user"></i>&nbsp; 用户管理&ndash;&gt;-->
<#--&lt;#&ndash;<span class="pull-right glyphicon glyphicon-chevron-toggle"></span>&ndash;&gt;-->
<#--&lt;#&ndash;</a>&ndash;&gt;-->
<#--&lt;#&ndash;<ul id="userMeun" class="nav nav-list collapse">&ndash;&gt;-->
<#--&lt;#&ndash;<li><a href="/userList" class="menu-second"><i class="fa fa-users"></i> 用户列表</a></li>&ndash;&gt;-->
<#--&lt;#&ndash;<li><a href="#" class="menu-second"><i class="fa fa-users"></i> 用户列表1</a>&ndash;&gt;-->
<#--&lt;#&ndash;</li>&ndash;&gt;-->
<#--&lt;#&ndash;<li><a href="#" class="menu-second"><i class="fa fa-users"></i> 用户列表2</a>&ndash;&gt;-->
<#--&lt;#&ndash;</li>&ndash;&gt;-->
<#--&lt;#&ndash;</ul>&ndash;&gt;-->
<#--&lt;#&ndash;</li>&ndash;&gt;-->
<#--</ul>-->
<#--</div>-->
<#--</div>-->
<#--</div>-->
<#--</div>-->
<#--</#macro>-->

<#--<#macro mainMenu parentMenu>-->
<#--<li>-->
<#--<#if parentMenu.children?exists>-->
<#--<a href="#${parentMenu.cModelName}" class="nav-header menu-first collapsed" data-toggle="collapse"-->
<#--data-parent="#menuUl">-->
<#--<i class="fa fa-gear"></i>&nbsp; ${parentMenu.cModelName}-->
<#--<span class="pull-right glyphicon glyphicon-chevron-toggle"></span>-->
<#--</a>-->
<#--<ul id="${parentMenu.cModelName}" class="nav nav-list collapse">-->
<#--<#list parentMenu.children as childMenu>-->
<#--<@mainMenu parentMenu=childMenu/>-->
<#--</#list>-->
<#--</ul>-->
<#--<#else>-->
<#--<a href="${request.contextPath}${parentMenu.cURL}" class="menu-second">-->
<#--&lt;#&ndash;<i class="fa fa-user"></i>&ndash;&gt;-->
<#--${parentMenu.cModelName}-->
<#--</a>-->
<#--</#if>-->
<#--</li>-->
<#--</#macro>-->

<#macro bottom>
<nav class="navbar navbar-default navbar-fixed-bottom">
    <div class="container bottomDiv">

    </div>
</nav>
</#macro>

<#macro page>
    <#if systemStyle=="tab">
    <div class="col-sm-12 content-main">
        <div id="content-wrapper">
            <#nested>
        </div>
    </div>
    <#else>
        <@top/>
        <#if systemLayout=="tcb">
        <#-- center -->
        <div class="col-sm-12 content-main content-top">
            <div id="content-wrapper" class="content-wrapper">
                <div class="row">
                    <#nested>
                </div>
            </div>
        </div>
        </#if>
        <#if systemLayout=="tlrb">
        <#-- left -->
            <@left/>
        <#-- right -->
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 content-main content-top">
            <div id="content-wrapper" class="content-wrapper">
                <div class="row">
                    <#nested>
                </div>
            </div>
        </div>
        </#if>
        <@bottom/>
    </#if>
</#macro>

<#macro tlrb>
<#-- top -->
    <@top/>
<#-- left -->
    <@left/>
<#-- right -->
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 content-main content-top">
    <div id="content-wrapper" class="content-wrapper">
        <div class="row">
            <#nested>
        </div>
    </div>
</div>
<#-- bottom -->
    <@bottom/>
</#macro>

<#macro tcb>
<#-- top -->
    <@top/>
<#-- center -->
<div class="col-sm-12 content-main content-top">
    <div id="content-wrapper" class="content-wrapper">
        <div class="row">
            <#nested>
        </div>
    </div>
</div>
<#-- bottom -->
    <@bottom/>
</#macro>

<#macro breadcrumb
title0="主页",href0="${request.contextPath}",
title1="",href1="",title2="",href2="">

<div class="row">
    <div class="col-lg-12">
        <ol class="breadcrumb">
            <li><a href="${href0}">${title0}</a></li>
            <#if title1!="">
                <li ${(href1=="")?string("class='active'","")}><span>${title1}</span></li>
            </#if>
            <#if title2!="">
                <li ${(href2=="")?string("class='active'","")}><span>${title2}</span></li>
            </#if>
        </ol>
        <div class="clearfix">
            <h1 class="pull-left">
                <#if title2!="">${title2}<#elseif title1!="">${title1}<#else>${title0}</#if>
            </h1>
        </div>
    </div>
</div>
</#macro>